import 'elix/define/Dialog.js'
import 'elix/define/ProgressSpinner'
import pwsdHtml from './loading.html'

const $click = (element, handler) => {
    element.addEventListener('click', handler)
    element.addEventListener('touchend', handler)
  }
export class loadingpage extends HTMLElement{
    constructor(svgShow,init){
        super()
        const template = document.createElement('template')
        template.innerHTML = pwsdHtml
        this.svgShow = svgShow
        this.svgShow.$svgShow.append(template.content.cloneNode(true))
        this.$docDialog = this.svgShow.$svgShow.querySelector("#loading_box")
        this.$container = this.svgShow.$svgShow.querySelector("#cto")
        this.$waitSecond = this.svgShow.$svgShow.querySelector("#waitSecond")
        this.initSecond = 10;
        this.startSecond = this.initSecond
        this.$waitSecond.textContent = this.startSecond
        this.init()
    }

    open(){
        this.$docDialog.open()
        this.waitint = this.waitSecond()
    }

    close(){
        this.$docDialog.close()
        this.startSecond = this.initSecond
        clearInterval(this.waitint)
        this.$waitSecond.textContent = this.startSecond
    }

    alertMsg(msg){
        svGShow.msginfo.open(msg)
    }

    waitSecond(){
        var that = this
        var secondText = function() {
            that.startSecond--
            that.$waitSecond.textContent = that.startSecond
            if(that.startSecond == 0){
                clearInterval(waitint)
                that.alertMsg("执行超时")
            }
        }
        var waitint = setInterval(secondText,1000)
        return waitint
    }

    init(){
        this.$close = this.svgShow.$svgShow.querySelector('.closeloading1')
        this.$cancleBtn = this.svgShow.$svgShow.querySelector('#loadingcancle')
        var that = this
        $click(this.$close, function () {
            that.close()
        })
        $click(this.$cancleBtn, function () {
            that.close()
        })
    }

}
customElements.define('loading-dialog', loadingpage)

